<%@ include file="sites/ad_header.jsp" %>
<%
	if(session.getAttribute("user") ==null){
		response.sendRedirect("LoadIndex.jsp");
	}
%>

<div class="r-body">
	<div class="page-title">
		<p>Register</p>
	</div>
	<div class="frm-action">
			<%
			String error=request.getParameter("error");
			String success=request.getParameter("success");
			 if(error !=null){
			%>
		     <span style="padding:0;color:red;"><%=error%></span>
		   <%}else if(success !=null) {
			 %>
			 	<span class="success" style="background: none repeat scroll 0 0 hsl(195, 53%, 79%);  border-radius: 7px;   padding:8px 428px 8px 404px;    font-weight: bold;   text-align: center;"><%=success%></span>
			 <% 
		   }%>
			
		<script type="text/javascript">
		$(function(){
			$(".success").show().delay(1500).fadeOut();
		});
		</script>
					<form action="./add_new_author.article" method="post" >
					<table border="0" cellpadding="10" >
						<tr>
							<td><a href="javascript:history.go(-1);"><img src="Image/go_back.png" class="go_back" title="Back to Main page"/></td>
							<td></td>
							<td></td>
							<td></td>
						</tr>
						<tr>
							<td>First Name</td>
							<td><input type="text" name="fname" class="firstName" required="required"/></td>							
							<td>Last Name</td>
							<td><input type="text" name="lname" class="lastName"  required="required"/></td>								
						</tr>
						<tr>
														
							<td>Gender</td>
								<td><select name="authorgender" class="userGender">
										<option value="0">Female</option>
										<option value="1">Male</option>										
									</select>
								</td>
							<td>Email</td>
							<td>
								<input type="text" name="email" class="userMail" required="required"/>
							</td>								
						</tr>
						<tr>
													
							<td>Phone No</td>
							<td><input type="text" name="authorphone" class="userPhone number" required="required"/></td>
							<td>Account Name</td>
							<td><input type="text" name="username" class="accountUserName" required="required"/></td>							
						</tr>
						<tr>						
							<td>Password</td>
							<td><input type="password" name="userpwd" class="accountPassword" required="required"/></td>							
							<td>Confirm</td>
							<td><input type="password" name="conpwd" class="confPassword" required="required"/></td>							
						</tr>
						<tr>
							<td></td>
							<td></td>
							<td></td>
							<td><input type="submit" value="REGISTER" class="btn-default cmd-register" style="float:right;"/></td>
						</tr>
					</table>		
	</form>
	<style type="text/css">
		.err-border{border:1px solid #f00;}
	</style>
	
	
	<script type="text/javascript">
		$(function(){
			
			$(".cmd-register").click(function(){
				var pass=$(".accountPassword").val();
				var conf=$(".confPassword").val();
				if(pass==conf){
					return true;
				}else{
					alert("Confirm password doesn't match! try again.");
					$(".confPassword").val("");
					return false;
				}
			});
			
			 $('.number').bind('keyup', function(e) { 
					var b;
					if(e.which!=8 && e.which!=0 && (e.which<48 || e.which>57)){
						b=false;
					}else{
						b=true;
					}	
					if(b==false){
						$(this).addClass("err-border");
						$(this).val("");
						return false;
					}else{
						$(this).removeClass("err-border");
						return true;
					}				
				});	
			
			
			
		});
	</script>

</div><!-- End r-body -->